<template>
	<div>
		<div class="row">
			<div class="col-md-12">
				<div class="panel-group" id="accordion2">
					<div class="panel panel-accordion" v-for="(items, index) in noticeList.result" :class="{'panel-accordion-primary': index !== 0}">
						<div class="panel-heading bk-bg-primary">
							<h4 class="panel-title">
								<a class="accordion-toggle" :class="{'collapsed': index !== 0}" data-toggle="collapse" data-parent="#accordion2" :href="'#accordionTO'+index">
									<i class="fa fa-bell-o"></i> {{ items.title }}
								</a>
								<div class="panel-actions">
									<a class="btn-setting" style="color: #fff;" @click="noticeDel(items.id)">删除 &nbsp;&nbsp;</a>
								</div>
							</h4>
						</div>
						<div :id="'accordionTO'+index" class="accordion-body collapse " :class="{'in': index === 0}">
							<div class="panel-body">

								{{ items.content }}

							</div>
						</div>
					</div>
				</div>
			</div>

			<lsc-page
							mode="event"
							:totalPage="pages"
							:init-page="eventPage"
							:eventFunt="eventFunt"
							@go-page="goPage"></lsc-page>
		</div>
	</div>
</template>
<script>

	import LscPage from '../../components/page_list.vue'
	import {mapGetters} from 'vuex'

	export default{
		name: 'home',
		computed: {
			...mapGetters({
				navStatus: 'getNavStatus',
				noticeList: 'getNoticeList'
			}),
			pages () {
				if(this.noticeList.pageInfo){
					return this.noticeList.pageInfo.totalPage
				}
			}

		},
		data () {
			return {
				eventPage: 1,
				eventFunt: 'fetchNotice'
			}
		},
		methods: {

			goPage (data) {
				this.eventPage = data.page
			},
			// 删除
			noticeDel (ids) {
				let params = {
					id: ids
				}
				this.$store.dispatch('fetchNoticeDel', params)

			}
		},
		mounted () {

			this.$store.dispatch('fetchNotice', {page: 1})
		},
		components: {
			LscPage
		},
		watch: {
			noticeList (newVal) {
				this.eventPage = newVal.pageInfo.pageIndex
			}
		}
	}
</script>

<style>

</style>